<template>
	<view style="height: 100vh; background-color: #FFFFFF;">
		<u-navbar title-color="#FFFFFF" height="48" back-icon-color="#FFFFFF" :border-bottom="false" :is-fixed="true" :title="'维保数据'"></u-navbar>
		<u-form ref="maintenanceForm" :model="maintenanceForm" label-width="100px" class="wrap">
			<u-form-item v-if="equipmentId=='null'" label="所属主体" prop="enterpriseName" >
				<u-input :border="border" type="select" :select-open="enterpriseShow" v-model="maintenanceForm.enterpriseName" placeholder="请选择企业" @click="enterpriseShow=true"></u-input>
			</u-form-item>

			<u-form-item v-if="equipmentId=='null'" label="设备名称" prop="equipmentName" >
				<u-input :border="border" type="select" :select-open="equipmentShow" v-model="maintenanceForm.equipmentName" placeholder="请选择设备" @click="equipmentShow=true"></u-input>
			</u-form-item>

			<u-form-item v-if="equipmentId!='null'" label="设备名称">
				<u-input :border="border" disabled v-model="equipmentInfo.name" placeholder="请输入设备名称"></u-input>
			</u-form-item>

			<u-form-item label="维保类型" prop="maintenanceType">
				<u-input :border="border" type="select" :select-open="statusShow" v-model="maintenanceForm.maintenanceTypeName"
				 placeholder="请选择设备状态" @click="statusShow=true"></u-input>
			</u-form-item>
			<u-form-item label="维护状态" prop="maintenanceStatus">
				<u-input :border="border" type="select" :select-open="statusShow1" v-model="maintenanceForm.maintainStatusName"
				 placeholder="请选择维保状态" @click="statusShow1=true"></u-input>
			</u-form-item>
			
			<u-form-item  label="维保企业" prop="maintenanceEnterpriseName" >
				<u-input :border="border" type="select" :select-open="enterpriseShow1" v-model="maintenanceForm.maintenanceEnterpriseName" placeholder="请选择维保企业" @click="enterpriseShow1=true"></u-input>
			</u-form-item>
			
			<u-form-item  label="维护意见">
				<u-input :border="border" v-model="maintenanceForm.disposalOpinions" placeholder="请输入维护意见"></u-input>
			</u-form-item>

			<u-form-item label-position="left" label="维保描述" prop="maintenanceRemark">
				<u-input type="textarea" :border="border" placeholder="请填写维保描述" v-model="maintenanceForm.maintenanceRemark" />
			</u-form-item>

			<u-button @click="submit" type="primary">提交</u-button>
		</u-form>

		<!--选择器内容-->
		<!-- 企业 -->
		<u-select mode="single-column" :list="enterpriseList" value-name="ucId" label-name="name" v-model="enterpriseShow"
		 @confirm="enterpriseConfirm"></u-select>
		 
		 <u-select mode="single-column" :list="maintainEnterpriseList" value-name="ucId" label-name="name" v-model="enterpriseShow1"
		  @confirm="enterpriseConfirm1"></u-select>

		<!-- 设备 -->
		<u-select mode="single-column" :list="equipmentList" value-name="ucId" label-name="name" v-model="equipmentShow"
		 @confirm="equipmentConfirm"></u-select>

		<!-- 维保类型 -->
		<u-select mode="single-column" :list="statusList" v-model="statusShow" @confirm="statusConfirm"></u-select>
		
		<!-- 维保状态 -->
		<u-select mode="single-column" :list="statusList1" v-model="statusShow1" @confirm="statusConfirm1"></u-select>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				equipmentId: "",
				equipmentInfo: {},
				maintenanceForm: {
					maintainStatusName:"",
					maintenanceTypeName:"",
				},
				border: true,
				enterpriseShow: false,
				enterpriseShow1: false,
				enterpriseList: [],
				maintainEnterpriseList:[],
				equipmentShow: false,
				equipmentList: [],
				statusShow: false,
				statusShow1: false,
				statusList: [{
						label: "正常维护",
						value: 0
					},
					{
						label: "维修机器",
						value: 1
					},
					{
						label: "更换机器",
						value: 2
					}
				],
				statusList1: [{
						label: "未维护",
						value: 0
					},
					{
						label: "维护中",
						value: 1
					},
					{
						label: "已完成",
						value: 2
					}
				],
				rules: {
					enterpriseName: [
						// 对name字段进行必填验证
						{
							required: true,
							message: '请选择企业',
							trigger: ['change', 'blur']
						},
					],
					equipmentName: [
						// 对name字段进行必填验证
						{
							required: true,
							message: '请选择设备',
							trigger: ['change', 'blur']
						},
					],
					equipmentStatusName: [
						// 对name字段进行必填验证
						{
							required: true,
							message: '请选择设备状态',
							trigger: ['change', 'blur']
						},
					],
					maintenanceRemark:[
						{
							required: true,
							message: '请输入维保描述',
							trigger: ['blur']
						},
					]
				}
			}
		},
		// 校验
		onReady() {
			this.$refs.maintenanceForm.setRules(this.rules);
		},
		onLoad(e) {
			console.log(e)
			this.equipmentId = e.ucId
		},
		// 显示下拉框内容
		onShow() {
			this.initViews()
		},
		methods: {
			initViews(){
				if(this.equipmentId!="null"){
					this.getEquipmentInfo()
				}
					this.getEnterpriseList()
					this.getEquipmentList()
					this.getMainTainEnterpriseList()
				
			},
			getEquipmentInfo(){
				this.utils.request("/api/app/equipment/getInEquipmentVo", {deleted:false,ucId: this.equipmentId}, "post", "app", true).then(res => {
					this.equipmentInfo = res.data
					this.maintenanceForm.equipmentId = this.equipmentInfo.ucId
					this.maintenanceForm.enterpriseId = this.equipmentInfo.enterpriseId
				}).catch(error => {
					console.log(error)
				})
			},
			
			// 所属主体
			getEnterpriseList() {
				this.utils.request("/api/app/enterpriseDominant/getInEnterpriseDominantList", {deleted:false}, "post", "app", true).then(res => {
					this.enterpriseList = res.data
				}).catch(error => {
					console.log(error)
				})
			},
			// 维保企业
			getMainTainEnterpriseList() {
				this.utils.request("/api/app/enterpriseDominant/getInEnterpriseDominantList", {dominantType:9,delete:false}, "post", "app", true).then(res => {
					console.log(res.data)
					this.maintainEnterpriseList = res.data
				}).catch(error => {
					console.log(error)
				})
			},
			// 设备id
			getEquipmentList(val) {
				this.utils.request("/api/app/equipment/getEquipmentList", {enterpriseId:val,}, "post", "app", true).then(res => {
					this.equipmentList=res.data
				}).catch(error => {
					console.log(error)
				})
			},
			enterpriseConfirm(e) {
				e.map((val, index) => {
					this.maintenanceForm.enterpriseName = val.label
					this.maintenanceForm.enterpriseId = val.value
					this.getEquipmentList(val.value)
				})
			},
			enterpriseConfirm1(e) {
				e.map((val, index) => {
					this.maintenanceForm.maintenanceEnterpriseName = val.label
					this.maintenanceForm.maintenanceEnterprise = val.value
				})
			},
			equipmentConfirm(e){
				e.map((val, index) => {
					this.maintenanceForm.equipmentName = val.label
					this.maintenanceForm.equipmentId = val.value
				})
			},
			statusConfirm(e){
				e.map((val, index) => {
					this.maintenanceForm.maintenanceTypeName = val.label
					this.maintenanceForm.maintenanceType = val.value
				})
			},
			
			statusConfirm1(e){
				e.map((val, index) => {
					this.maintenanceForm.maintainStatusName = val.label
					this.maintenanceForm.maintenanceStatus = val.value
				})
			},
			
			// 点击提交
			submit(){
				console.log(`返回结果：+`, this.maintenanceForm)
				this.$refs.maintenanceForm.validate(valid => {
					if (valid) {
						this.utils.request("/api/app/maintenance/addInEquipmentMaintenance", this.maintenanceForm, "post", "app", true).then(res => {
							console.log(`返回结果：+`, res)
							uni.navigateBack({
								delta:1
							})
						}).catch(error => {
							console.log(error)
						})
					} else {
						console.log('验证失败');
					}
				});
			}
		}
	}
</script>

<style>

</style>
